<template>
	<view class="refundType">
		<nav-bars backState="1000" :bgColor="navBackground" fontColor="#333333" title="选择服务"></nav-bars>
		<view class="wrap">
			<view class="title">
				<text>选择服务</text>
			</view>
			<view class="service-item" @click="choiceType(1)">
				<image :src="`${baseImg}/static/mall/refund.png`" mode=""></image>
				<view class="type">
					<view class="type-tag">我要退款（无须退货）</view>
					<view class="explain">没收到货，或与卖家协商同意不退货只退款</view>
				</view>
				<view class="iconfont icon-more"></view>
			</view>
			<view class="service-item" @click="choiceType(3)" v-if="order_status!=2">
				<image :src="`${baseImg}/static/mall/return_goods.png`" mode=""></image>
				<view class="type">
					<view class="type-tag">我要退货退款</view>
					<view class="explain">已收到货，需要退还收到的货物</view>
				</view>
				<view class="iconfont icon-more"></view>
			</view>
		<!-- 	<view class="service-item" @click="choiceType(3)">
				<image :src="`${baseImg}/static/mall/detailAddress.png`" mode=""></image>
				<view class="type">
					<view class="type-tag">我要换货</view>
					<view class="explain">已收到货，需要更换已收到的货物</view>
				</view>
				<view class="iconfont icon-more"></view>
			</view> -->
		</view>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				baseImg: 'http://manager.ryz1620.com',
				navBackground: '',
				order_code:'',
				order_status:'',//订单状态
			}
		},
		onLoad(options) {
			this.$utils.getUrl()
			this.order_code = options.orderid;
			this.order_status=options.status;
		},
		methods:{
			choiceType(type){
				if(type===1){
					this.$common.navigateTo('/pages_mall/pages/mall/after_sale/refund?type=' + type+'&order_code='+this.order_code);
				}else{
					this.$common.navigateTo('/pages_mall/pages/mall/after_sale/refundGoods?type=' + type+'&order_code='+this.order_code);
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.refundType {
		width: 100%;
		height: 100vh;
	}

	.wrap {
		width: 93.6%;
		margin: 90rpx auto;

		.title {
			width: 100%;
			height: 48rpx;
			line-height: 48rpx;
			color: #333333;
			font-weight: bold;
			font-size: 32rpx;
		}

		.service-item {
			display: flex;
			width: 100%;
			padding: 58rpx 0 0rpx 0;

			.type {
				margin-left: 4rpx;

				.type-tag {
					color: #3D3D3D;
					font-weight: bold;
				}

				.explain {
					font-size: 24rpx;
					color: #9E9E9E;
				}
			}

			.icon-more {
				color: #CCCCCC;
				font-size: 28rpx;
				font-weight: 600;
				margin: 28rpx 0 0 auto;
			}

			image {
				width: 80rpx;
				height: 80rpx;
				vertical-align: middle;
			}
		}
	}
</style>
